<template>
  <div class="userlist">
    <el-input placeholder="🔍请输入内容" v-model="keywords" clearable></el-input>
    <mt-header fixed title="道路货物运输量专项调查" style="z-index: 999999;">
      <span slot="left" @click="goBack">
        <mt-button icon="back" slot="left">返回</mt-button>
      </span>
      <mt-button v-if="dbFlag" icon slot="right" @click.native="checkRemoveReplaceReport">取消代报</mt-button>
      <mt-button v-if="!dbFlag" icon slot="right" @click.native="checkReportByother">代报</mt-button>
    </mt-header>
    <div  class="titletools">
      <a :class="{active:dbFlag}"  class="mui-control-item mui-active" @tap="dbqy">
        代报业户
      </a>
      <a :class="{active:!dbFlag}"   class="mui-control-item" @tap="wdbqy">未代报业户</a>
    </div>
    <mt-checklist align="right" v-model="value" :options="options"></mt-checklist>

  </div>
</template>

<script>
import { Toast } from "mint-ui";
import { Checklist } from "mint-ui";
import { Indicator } from "mint-ui";
export default {
  data() {
    return {
      keywords: "",
      value: [],
      options: [],
      resultList: [],
      // 判断代报和未代报选项卡是否显示 
      dbFlag: true
    };
  },
  mounted() {
    this.gettestdate();
    Indicator.open({
      text: "加载中...",
      spinnerType: "fading-circle"
    });
  },
  watch: {
    value(value) {
      console.log(value);
    },
    keywords(value) {
      if (this.resultList == []) {
        return;
      }
      this.options = [];
      this.resultList.filter(item => {
        if (item.companyName.includes(value)) {
          let companyItem = {};
          companyItem.label = item.companyName;
          companyItem.value = item.licenseCode;
          this.options.push(companyItem);
        }
      });
    },
  },
  methods: {
    dbqy() {
      this.dbFlag = true;
      this.options = [];
      this.resultList.forEach(item => {
              if(item.reportedByOther == '1'){
                  let companyItem = {};
                  companyItem.label = item.companyName;
                  companyItem.value = item.licenseCode;
                  this.options.push(companyItem);
              }
            });
    },
    wdbqy() {
      this.dbFlag = false;
      this.options = [];
      this.resultList.forEach(item => {
              if(item.reportedByOther == '0'){
                  let companyItem = {};
                  companyItem.label = item.companyName;
                  companyItem.value = item.licenseCode;
                  this.options.push(companyItem);
              }
            });
      //this.dlhyFlag = false; 
      //this.msg = "hycl";
    },
    goBack() {
      Indicator.close();
      //点击后退
      this.$router.go(-1);
    },
    gettestdate() {
      this.axios
        .post(
          "http://zxdc.catsic.com:9090/sampling/fill/replaceReportSettingsForList",
          {
            data: {
              name: localStorage.getItem("userName")
            }
          },
          {
            headers: {
              "Content-Type": "application/json",
              mobileHeader:
                '{"sessionId":' + localStorage.getItem("sessionId") + "}"
            }
          }
        )
        .then(result => {
          console.log(JSON.stringify(result)+"--------------");
          if (result.data.status === "1000") {
            Indicator.close();
            Toast("获取列表成功");
            this.resultList = result.data.data.sampleList;
            console.log( this.resultList);
            result.data.data.sampleList.forEach(item => {
            if(item.reportedByOther == '1'){
                  let companyItem = {};
                  companyItem.label = item.companyName;
                  companyItem.value = item.licenseCode;
                  this.options.push(companyItem);
            }
            });
            //console.log(this.options);
            //console.log(result);
          } else if (
            result.data.status === "1002" ||
            result.data.status === "4001" ||
            result.data.status === "5005"
          ) {
            Indicator.close();
            this.dateFlag = true;
            this.sessionId = "";
            localStorage.setItem("sessionId", JSON.stringify(this.sessionId));
            this.$store.commit("outLogin");
            this.msg = result.data.msg;
            Toast(this.msg);
            this.$router.push({
              path: "/login"
            });
          } else if (result.data.status === "1001") {
            Indicator.close();
            Toast(result.data.msg);
          } else if (result.data.status === "5001") {
            Indicator.close();
            Toast(result.data.msg);
          }
        });
    },

    checkReportByother(){
        if(this.value.length > 0){
            this.reportByother();
        } else {
          Toast("请至少选择一项");
        }
    },

    reportByother() {
      
      console.log(JSON.stringify(this.value)+"------");
      this.axios
        .post(
          "http://zxdc.catsic.com:9090/sampling/fill/replaceReportSettingsForChangeState",
          {
            data: {
              licenseCodeList: this.value,
              userName: localStorage.getItem("userName")
            }
          },
          {
            headers: {
              "Content-Type": "application/json",
              mobileHeader:
                '{"sessionId":' + localStorage.getItem("sessionId") + "}"
            }
          }
        )
        .then(result => {
          if (result.data.status === "1000") {
            Toast("设置成功");
            this.$router.go(-1);
            //console.log(result);
          } else if (
            result.data.status === "1002" ||
            result.data.status === "4001" ||
            result.data.status === "5005"
          ) {
            this.dateFlag = true;
            this.sessionId = "";
            localStorage.setItem("sessionId", JSON.stringify(this.sessionId));
            this.$store.commit("outLogin");
            this.msg = result.data.msg;
            Toast(this.msg);
            this.$router.push({
              path: "/login"
            });
          } else if (result.data.status === "1001") {
            Toast(result.data.msg);
          } else if (result.data.status === "5001") {
            Indicator.close();
            Toast(result.data.msg);
          }
        });
    },
    checkRemoveReplaceReport(){
        if(this.value.length > 0){
            this.removeReplaceReport();
        } else {
          Toast("请至少选择一项");
        }
    },
    removeReplaceReport() {
      this.axios
        .post(
          "http://zxdc.catsic.com:9090/sampling/fill/removeReplaceReport",
          {
            data: {
              licenseCodeList: this.value,
              userName: localStorage.getItem("userName")
            }
          },
          {
            headers: {
              "Content-Type": "application/json",
              mobileHeader:
                '{"sessionId":' + localStorage.getItem("sessionId") + "}"
            }
          }
        )
        .then(result => {
          if (result.data.status === "1000") {
            Toast("设置成功");
            this.$router.go(-1);
            //console.log(result);
          } else if (
            result.data.status === "1002" ||
            result.data.status === "4001" ||
            result.data.status === "5005"
          ) {
            this.dateFlag = true;
            this.sessionId = "";
            localStorage.setItem("sessionId", JSON.stringify(this.sessionId));
            this.$store.commit("outLogin");
            this.msg = result.data.msg;
            Toast(this.msg);
            this.$router.push({
              path: "/login"
            });
          } else if (result.data.status === "1001") {
            Toast(result.data.msg);
          } else if (result.data.status === "5001") {
            Indicator.close();
            Toast(result.data.msg);
          }
        });
    },
  }
};
</script>

<style lang="scss" scoped>
mt-header {
  z-index: 999;
  /*padding-top: 20px;*/
}

.mint-header {
  height: 40px;
  /*padding-top: 30px;*/
}

.userlist {
  height: 100%;
  width: 100%;
  /*padding-top: 80px;*/

  padding-top: 50px;
  .fonts {
    font-size: 14px;
    color: #226aff;
    /* display: flex;
            justify-content:space-between; */
    /* margin: 0 10% 0 50%;
            display: inline-block;   */
    float: right;
  }
  .time {
    font-size: 14px;
    color: #226aff;
    margin: 0 0 0 5%;
  }
  .sbqk {
    font-size: 14px;
    color: #226aff;
    margin: 0 5% 0 60%;
  }
  .company {
    font-size: 16px;
    color: #030303;
  }
  .mui-table-view-cell > a:not(.mui-btn).mui-active {
    background-color: #fff;
  }
  .el-input__icon {
    height: 70%;
    width: 25px;
    text-align: center;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    line-height: 40px;
  }
  .titletools {
    display: flex;
    justify-content: space-around;
    height: 40px;
    padding-top: 2%;
    background: #ffffff;
    margin-bottom: 2%;
  }
  .active {
    text-decoration: none;
    color: #007aff;
    border-bottom: 2px solid #007aff;
  }
}
</style>